<template>
  <div class="search-container">
    <el-input v-model="inputValue" placeholder="请输入查询内容"></el-input>
    <el-button type="primary" @click="handleSearch">查询</el-button>
  </div>
</template>

<script setup>
import { ref } from 'vue';
import { ElInput, ElButton } from 'element-plus';

// 定义响应式数据，绑定输入框的值
const inputValue = ref('');

// 定义查询方法
const handleSearch = () => {
  console.log('查询内容为：', inputValue.value);
  // 这里可以替换为真实的查询逻辑，比如发送请求等
};

// 注册Element-Plus组件，按需引入的方式
// 如果你是全局引入了Element-Plus，则不需要下面这行代码
const components = { ElInput, ElButton };
</script>

<style scoped>
.search-container {
  display: flex;
}
</style>